<!--
 * @Description: 节点完成(逾期/未逾期)
 * @Author: wind-lc
 * @version: 1.0
 * @Date: 2023-03-20 09:56:42
 * @LastEditTime: 2023-03-31 11:03:24
 * @FilePath: \cscec-pms-admin\src\views\construction\weekPlan\components\NodeCompletion.vue
-->
<template>
  <BaseModal
    :visible="visible"
    title="节点完成"
    :width="1200"
    destroy-on-close
    @cancel="handleModalCancel()"
  >
    <div class="node-completion">
      <NodeCompletionView
        ref="nodeCompletionView"
        :source="source"
        :loading.sync="loading"
        :submiting.sync="submiting"
        use-modal
        @handleModalCancel="handleModalCancel"
      />
    </div>
    <template slot="footer">
      <a-button @click="handleModalCancel()">
        取消
      </a-button>
      <a-button
        v-if="source.type !== 'detail'"
        type="primary"
        :disabled="loading"
        :loading="submiting"
        @click="handleSubmit"
      >
        提交审批
      </a-button>
    </template>
  </BaseModal>
</template>
<script>
import BaseModal from '@/components/BaseModal'
import NodeCompletionView from './NodeCompletionView'
export default {
  name: 'NodeCompletion',
  components: {
    BaseModal,
    NodeCompletionView
  },
  props: {
    // 隐藏显示
    visible: {
      type: Boolean,
      require: true
    },
    // 节点完成数据
    source: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      // 加载
      loading: false,
      // 提交
      submiting: false
    }
  },
  watch: {
    // 弹窗监测
    visible: {
      handler(v) {
        if (v) {
          this.$nextTick(() => {
            this.$refs.nodeCompletionView.getData()
          })
        } else {
          this.$refs.nodeCompletionView.handleclose()
        }
      }
    }
  },
  methods: {
    /**
     * @description: 关闭模态框
     * @param {boolean} refresh 是否需要刷新
     * @return {void}
     */
    handleModalCancel(refresh = false) {
      this.$refs.nodeCompletionView.handleclose()
      this.$emit('update:visible', false)
      if (refresh) {
        this.$emit('refresh', true)
      }
    },
    /**
     * @description: 提交审批
     * @param {void}
     * @return {void}
     */
    handleSubmit() {
      this.$refs.nodeCompletionView.handleSubmit()
    }
  }
}
</script>
<style lang="less" scoped>
.node-completion {
  height: calc(var(--heightVh) * 0.6);
  overflow-y: auto;
  padding-right: 10px;
}

.status-list {
  display: flex;
  align-items: center;
  margin-top: 7px;
}
.prompt-lights {
  width: 59px;
  height: 23px;
  display: flex;
  align-items: center;
  justify-content: center;
}
</style>
